<template>
  <div class="check_list">
    <ul>
      <li v-for="n in 10">
        <router-link to="" class="wrapper">
         <!-- <div v-if="list.img.length>0">
            <div class="re_img" v-for="(item,index) in list.img" v-if="index==0">
              &lt;!&ndash;<img v-lazy="item" alt="">&ndash;&gt;
              <div class="img" v-lazy:background-image="item"></div>
            </div>
          </div>-->
          <div>
            <div class="re_img">
              <img src="../home/images/default.png" alt="">
            </div>
          </div>
          <div class="content">
            <h3 class="title">消防电梯的查验</h3>
            <p class="des">经过一番查验，看出来小区出现了很多的问题</p>
            <div class="address">
              <span>10分钟前</span>
              <span>地址：下城区善贤路4号光阳国际</span>
            </div>
          </div>
          <div class="go-icon"></div>
        </router-link>
      </li>
    </ul>
  </div>
</template>
<style lang="scss">
  @import '../../common/sass/index.scss';

  .check_list {
    margin-top: 90px;
    margin-bottom: 60px;
    ul {
      /*margin-bottom: 70px;*/
      li {
        background: #fff;
        border-bottom: 1px solid rgb(217, 217, 217);
        /*&:last-child {*/
        /*border-bottom: 1px solid transparent;*/
        /*}*/
        .wrapper {
          position: relative;
          display: flex;
          padding: 15px 0;
          .re_img {
            width: 44px;
            height: 55px;
            margin-left: 5px;
            margin-right: 5px;
            display: block;
            flex: 0 0 44px;
            .img {
              width: 100%;
              height: 100%;
              background: #f2f2f2;
              background-size: cover;
              background-position: center;
            }
            img {
              width: 100%;
              height: 100%;
              background: #f2f2f2;
            }
          }
          .content {
            width: 80%;
            .title {
              font-size: 15px;
              color: rgb(41, 41, 41);
              font-weight: 400;
            }
            .des {
              font-size: 13px;
              color: #666;
              @include ellipsis(1);
              width: 95%;
              line-height: 16px;
              margin-top: 5px;
            }
            .address{
              display: flex;
              justify-content: space-between;
              align-items: center;
              width: 100%;
              span{
                color: #999999;
                margin-top: 5px;
              }
            }
          }
          .go-icon {
            position: absolute;
            top: 30px;
            right: 10px;
            width: 8px;
            height: 16px;
            background-size: 8px 16px;
            background-repeat: no-repeat;
            @include bgimg('./images/back')
          }
        }
      }
    }
  }
</style>
<script>
  export default {
    data () {
      return {}
    },
    props: ['lists'],
    methods: {}
  }
</script>
